<!-- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
SPDX-License-Identifier: Apache-2.0
ABOUT THIS NODE.JS EXAMPLE: This example works with AWS SDK for JavaScript version 3 (v3),
which is available at https://github.com/aws/aws-sdk-js-v3.

Purpose:
index.html is the front-end HTML code for a tutorial demonstrating how to stream speech using Amazon Transcribe.
*/
-->

<!-- snippet-start:[transcribe.HTML.streaming.indexv3] -->
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>title</title>
    <link rel="stylesheet" type="text/css" href="recorder.css">
    <script type="text/javascript" src="./main.js"></script>

</head>
<body>
<h1>Record, translate, transcribe, and email</h1>
<ol>
    <li>Record your voice.</li>
    <li>Select a target language to translate the transcription into.</li>
    <li>Select <b>Translate</b>.</li>
    <li>Enter an email address to send the trascription to.</li>
    <li>Select <b>Send email</b>.</li>
</ol>
<p>
    <button id="record" onclick="startRecord()"></button>
    <button id="stopRecord" disabled onclick="stopRecord()">Stop & clear</button>
</p>
<h2>Transcription</h2>
<div id="output"></div>
<div id = "transButton">
<select id="list" style="padding: 10px;">
    <option value="nan">Select lang.</option>
    <option value="en">English</option>
    <option value="fr">French</option>
    <option value="de">German</option>
    <option value="it">Italian</option>
    <option value="es">Spanish</option>
    <option value="ko">Korean</option>
    <option value="pt">Portugese</option>
    <option value="zh">Chinese (Simp.)</option>
    <option value="zh-TW">Chinese (Trad.)</option>
</select><button id="button1" onclick="translateText()">Translate</button><button id="button2" onclick="clearTranscription()">Clear</button></div>

<h2>Translation</h2>
<div id="translated"></div>
<div id="emailAddress">
    <p><input type="text" id="email" name="email" placeholder="Enter email"><button id="button" onclick="sendEmail()">Send email</button></p>
    <p><b>* </b>The email address must be registered with Amazon Amazon Simple Email Service (Amazon SES).</p>
</div>
<script type="text/javascript" src="./main.js"></script>
</body>

</html>
<!-- snippet-end:[transcribe.HTML.streaming.indexv3] -->
